import React, { Component } from 'react';
import { confirmOrder } from "../api/index";
import { NavBar } from 'antd-mobile';
import '../styles/dingdan.scss'
class querendingdan extends Component {
    constructor(props) {
        super(props);
        this.state = {
            list: [],
            pic:0,
            geshu:0
        }
    }
    // 商品总价
    async componentDidMount() {

        let res = await confirmOrder({ userid: localStorage.getItem('userid'),time:localStorage.getItem('time') })
        console.log('获取订单信息',res.data.data);
        
        this.setState({ list: res.data.data })
        var num1=0
        var num2=0
        res.data.data.forEach((item)=>{
            num1=num1+item.originprice*item.num
            num2=num2+item.num
        })
        console.log(num1,num2);
        this.setState({pic:num1,geshu:num2})
    }
    gozhifu(){
        alert('别点了啥也没')
    }
    render() {
        return (
            <div className='dingdan'>
                <NavBar className='header' onBack={() => { this.props.history.go(-1) }}>确认订单</NavBar>
                <div>地址栏</div>
                <div className="cartlist">
                    {
                        this.state.list && this.state.list.map((item, index) => {
                            return (
                                <div className="car_list_item" key={index}>
                                    <div className="tu3"><img src={item.img1} alt="" /></div>
                                    <div className="wenzi3">
                                        <p className='p1'>{item.proname}</p>
                                        <p className='p3'>￥{item.originprice}</p>
                                    </div>
                                    <div className="num3">
                                        <div></div>
                                        x{item.num}
                                    </div>
                                </div>
                            )
                        })
                    }
                </div>
                <div>
                    <div>原价：￥{this.state.pic}</div>
                    <div>总计个数:{this.state.geshu}个 </div>
                </div>
                <div className='zhifu'>
                    <div className='piccc'>合计：￥{this.state.pic}.00</div>
                    <button onClick={this.gozhifu}>去支付</button>
                </div>
            </div>
        );
    }
}

export default querendingdan;